import React from 'react'
import VolunteerDashboard from './VolunteerDashboard'
import VisuallyImpairedDashboard from './VisuallyImpairedDashboard'

const Dashboard = ({ currentUser, userType, onLogout }) => {
  return (
    <div className="app">
      <div className="background-elements">
        <div className="floating-heart">❤️</div>
        <div className="floating-eye">👁️</div>
        <div className="floating-hands">🤝</div>
        <div className="floating-star">⭐</div>
      </div>

      <div className="container dashboard-container">
        {userType === 'volunteer' ? (
          <VolunteerDashboard currentUser={currentUser} onLogout={onLogout} />
        ) : (
          <VisuallyImpairedDashboard currentUser={currentUser} onLogout={onLogout} />
        )}
      </div>
    </div>
  )
}

export default Dashboard
